﻿
function ContactPage() {

    this.Places = new Array();
    this.PlaceMarkers = new Array();
    this.PlaceLines = new Array();

    this.HotelLocation = $('#hiddenHotelLocation').val().split(',');
    this.HotelLocation = new google.maps.LatLng(parseFloat(this.HotelLocation[0]), parseFloat(this.HotelLocation[1]));

    var mapOptions = {
        zoom: 13,
        center: this.HotelLocation,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    this.Map = new google.maps.Map(document.getElementById('map-canvas'),
        mapOptions);

    var marker = new google.maps.Marker({
        position: this.HotelLocation,
        map: this.Map,
        icon: 'http://maps.google.com/mapfiles/ms/icons/blue-dot.png',
        title: $('*[data-type=hotel-name]').text()
    });

    this.Places = this.GetPlaces();
}

ContactPage.prototype.GetPlaces = function () {
    var places = new Array();
    $('#contact-places-list article').each(function () {
        places.push(new ContactPlace($(this)));
    });
    return places;
};

ContactPage.prototype.ShowCategoryPlaces = function (categoryId) {
    this.ClearMap();
    for (var xp = 0; xp < this.Places.length; xp++) {
        if (this.Places[xp].CategoryId == categoryId)
            this.__ShowPlaceOnMap(this.Places[xp]);
    }

    $('#selectOnMap li.active').removeClass('active');
    $('#selectOnMap li[data-show=places-' + categoryId + ']').addClass('active');
    $('#contact-places-list article').hide();
    $('#contact-places-list article[data-categoryid=' + categoryId + ']').show();

    this.FitMap();
};

ContactPage.prototype.ShowPlaceOnMap = function (placeId) {
    for (var xp = 0; xp < this.Places.length; xp++) {
        if (this.Places[xp].Id == placeId) {
            this.ClearMap();
            $('#selectOnMap li.active').removeClass('active');
            this.__ShowPlaceOnMap(this.Places[xp]);
            this.FitMap();
            break;
        }
    }
};

ContactPage.prototype.FitMap = function () {
    var bounds = new google.maps.LatLngBounds();
    bounds.extend(this.HotelLocation);
    for (var xp = 0; xp < this.PlaceMarkers.length; xp++) {
        var latlng = this.PlaceMarkers[xp].getPosition();
        bounds.extend(latlng);
    }
    this.Map.fitBounds(bounds);
};

ContactPage.prototype.ClearMap = function () {
    for (var xm = 0; xm < this.PlaceMarkers.length; xm++) {
        this.PlaceMarkers[xm].setMap(null);
    }
    this.PlaceMarkers = new Array();

    for (var xl = 0; xl < this.PlaceLines.length; xl++) {
        this.PlaceLines[xl].setMap(null);
    }
    this.PlaceLines = new Array();
};

ContactPage.prototype.__ShowPlaceOnMap = function (place) {

    var infoContent = '<div class="contactInfoWindow"> \
                    <h3>' + place.Name + '</h3> \
                    <p class="subtitle">' + place.Subtitle + '</p> \
                    <p class="address">' + place.Address + '</p> \
                    <p class="distance"> \
                        <span class="distance-value">' + place.Distance + '</span><span class="distance-time"> ' + place.DistanceFromHotel + '</span> \
                    </p> \
                    </div>';
    var infowindow = new google.maps.InfoWindow({
        content: infoContent
    });

    var marker = new google.maps.Marker({
        position: place.Location,
        map: this.Map,
        title: place.Name
    });
    var map = this.Map;
    google.maps.event.addListener(marker, 'click', function () {
        infowindow.open(map, marker);
    });

    var lineCoords = [this.HotelLocation, place.Location];
    var line = new google.maps.Polyline({
        path: lineCoords,
        strokeColor: '#F7584C',
        strokeOpacity: 0.8,
        strokeWeight: 2,
        map: map
    });

    this.PlaceMarkers.push(marker);
    this.PlaceLines.push(line);
};

function ContactPlace($articleElement) {

    this.Element = $articleElement;
    this.Id = parseInt($articleElement.attr('data-id'));
    this.CategoryId = parseInt($articleElement.attr('data-categoryid'));
    this.Location = new google.maps.LatLng(parseFloat($articleElement.attr('data-locationlat')), parseFloat($articleElement.attr('data-locationlng')));
    this.Name = $articleElement.find('h3').text();
    this.Subtitle = $articleElement.find('p.subtitle').text();
    this.Address = $articleElement.find('p.address').text();
    this.Distance = $articleElement.find('span.distance-value').text();
    this.DistanceFromHotel = $articleElement.find('span.distance-time').text();
}

$(function () {
    var cp = new ContactPage();
    $(window).data('contact-page', cp);
    $('*[data-show]').css('cursor', 'pointer').click(function () {
        var s = $(this).attr('data-show');
        //s = '';
        if (s.indexOf('places-') == 0) {
            var catId = parseInt(s.replace('places-', ''));
            cp.ShowCategoryPlaces(catId);
        } else
            cp.ShowPlaceOnMap(parseInt(s));
    });
    if (cp.Places.length > 3) {
        $(cp.Places).each(function () {
            this.__disth = parseInt(this.DistanceFromHotel);
        });
        cp.Places.sort(function (a, b) { return a.__disth - b.__disth; });
        for (var x = 0; x < 3; x++) {
            cp.Places[x].Element.show();
        }
    } else {
        $(cp.Places).each(function () { this.Element.show(); });
    }
});